<template>
	<view>
		<view class="padding-tb-xl">
			<view class="padding-tb-xl flex-col align-center">
				<image src="../../static/images/app-icon.png" style="width: 120rpx" mode="widthFix"></image>

				<view class="title margin-top">企大咖 {{version}}</view>
			</view>
		</view>

		<u-cell-group>
			<u-cell-item title="版本更新" :value="newVersion" @click="confirm"></u-cell-item>
			<u-cell-item title="功能介绍"></u-cell-item>
		</u-cell-group>

		<view class="btm padding flex-col align-center">
			<view class="link">《软件许可及服务协议》</view>
			<view class="link">《隐私保护指引》</view>
		</view>
		
		<u-modal v-model="show" title="下载进度">
			<view class="slot-content padding">
				<u-line-progress :striped="true" :percent="progress" :striped-active="true"></u-line-progress>
			</view>
		</u-modal>
	</view>
</template>

<script>
	import store from '@/store.js'
	export default {
		data() {
			return {
				newVersion: '',
				pkgUrl: '',
				wgtUrl: '',
				show: false,
				progress: 0
			};
		},
		computed: {
			name: state => store.state.name,
			version: state => store.state.version
		},
		onLoad() {
			this.getUpdate();
		},
		methods: {
			getUpdate() {
				this.$store.commit('getVer', () => {
					this.$u.get('/app/update', {
						version: this.$store.state.version,
						name: this.$store.state.name
					}).then(res => {
						let data = res.data.result
						this.newVersion = data.version
						this.wgtUrl = data.wgtUrl
						this.pkgUrl = data.pkgUrl
					})
				});
			},
			confirm() {
				if (this.newVersion) {
					uni.showModal({
						title: '更新提示',
						content: '更新应用到' + this.newVersion,
						success: (res) => {
							if (res.confirm) {
								this.update();
							}
						}
					})
				} else {
					this.$msg('已经是最新了')
				}
			},
			update() {
				if (this.pkgUrl) {
					plus.runtime.openURL(this.pkgUrl);
				} else if (this.wgtUrl) {
					let task = uni.downloadFile({
						url: this.wgtUrl,
						success: (downloadResult) => {
							console.log(downloadResult)
							plus.runtime.install(downloadResult.tempFilePath, {
								force: false
							}, () => {
								this.show = false
								this.progress = 0
								plus.runtime.restart();
							}, (err) => {
								this.$msg('安装失败...');
							});
						}
					});
					this.show = true
					task.onProgressUpdate((res) => {
						this.progress = res.progress
					});
				}
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #fff;
	}

	.title {
		font-size: 32rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
	}

	.btm {
		position: absolute;
		width: 100%;
		bottom: 0;
		left: 0;

		.link {
			font-size: 22rpx;
			margin-top: 16rpx;
			font-family: PingFangSC-Medium, PingFang SC;
			font-weight: 500;
			color: rgba(52, 211, 204, 1);
		}
	}
</style>
